<template>
    <div class="login">
        <van-form class="form" @submit="onSubmit">
            <div class="avatar">
                <img src="/assets/images/avatar.png" />
            </div>

            <van-field 
                v-model="business.mobile"
                name="mobile"
                placeholder="手机号码"
                left-icon="phone-o"
                :rules="[
                    {required: true, message: '请填写手机号码' },
                    {pattern: /^1[3-9]\d{9}$/, message: '手机号码格式不正确'}
                ]"
            />

            <van-field 
                v-model="business.password"
                type="password"
                name="password"
                placeholder="密码"
                left-icon="warn-o"
                required
                :rules="[{ required: true, message: '请填写密码' }]"
            />

            <div class="button">
                <van-button round block color="linear-gradient(160deg, #0093E9 0%, #80D0C7 100%)" native-type="submit">注册登录</van-button>
            </div>
                
            <div class="forget">
                <router-link to="/">返回首页</router-link>
            </div>
        </van-form>
    </div>
</template>

<script setup>
// 获取类似于vue2的this对象
const { proxy } = getCurrentInstance();

// 创建数据
const business = ref({
    mobile: '18100000000',
    password: '123123'
});

const token = ref(proxy.$route.query.token ?? '');

const onSubmit = async (values) => 
{
    if(token.value)
    {
        values.token = token.value;
    }

    //登录成功提醒并跳转
    let result = await proxy.$http.post({
        url:'/business/login',
        params:values
    })

    if(result.code === 1)
    {
        proxy.$success({
            message:result.msg,
            onClose:() =>
            {
                proxy.$business.value = result.data;

                let redirect = proxy.$http.get('redirect') ? proxy.$cookies.get('redirect') : '';

                // 跳转
                if(redirect)
                {
                    // 登录成功后删除重定向地址
                    proxy.$cookies.remove('redirect');

                    proxy.$router.back();
                }else{
                    proxy.$router.push({path:result.url});
                }
            }
        })
    }else{
        proxy.$fail(result.msg);
    }
}
</script>

<style scoped>
@import url('/assets/css/login.css');
</style>